<template>
  <div class="drag main-container">
    <div class="left-container">
      <left-menu></left-menu>
    </div>
    <div class="right-container">
      <keep-alive include="chat">
        <router-view></router-view>
      </keep-alive>

    </div>

  </div>
</template>

<script setup>
import ws from '@/webSocket'
import leftMenu from '@/framework/leftMenu/index.vue'
import chat from '@/views/chat/index.vue'
import { nextTick, onBeforeMount, onMounted } from 'vue'
import { useChatStore } from '../stores/chat'
import { useUserStore } from '../stores/user'
import { useRouter } from 'vue-router'
import { useSystemStore } from '../stores/system'

const userStore = useUserStore()
const router = useRouter()
const chatStore = useChatStore()
const systemStore = useSystemStore()


// 退出登录
window.ipcRenderer.on('logout' , (event , data) => {
  userStore.logout().then(res => {
    if (res) {
      ws.close()
      router.push('/login')
    }
  })
})

// 挂断电话
window.ipcRenderer.on('stopCall' , (event , data) => {
  ws.sendNotice({
    type:'call',
    method:'stop',
    data: data
  })
})

onBeforeMount(async () => {
  systemStore.showLoading = true
  ws.initWebSocket()
  if (!userStore.uid) {
    await userStore.userInfo()
  }
  chatStore.getSessionList()
  setTimeout(() => {
    systemStore.showLoading = false
  } , 1000)
})

</script>

<style scoped lang="less">
.main-container {
  width: 100vw;
  height: 100vh;
  display: flex;

  .left-container {
    height: 100%;

  }

  .right-container {
    flex: 1;
  }
}
</style>
